import React, {useCallback} from 'react';
import {View, Text, Button, StyleSheet, Modal} from 'react-native';
import {useDispatch, useSelector} from 'react-redux';
import PatIcon from '../../component/base/PatIcon';

const style = StyleSheet.create({
  loginRegister: {
    // flex: 1,
    position: 'absolute',
    width: '100%',
    height: '100%',
    zIndex: 9999,
    backgroundColor: '#13e5e6',
  },
});

const LoginRegiter = () => {
  const dispatch = useDispatch();
  const isLogin = useSelector(state => state.user.isLogin);
  const isShowLoginRegister = useSelector(state => {
    return state.user.isShowLoginRegister;
  });
  const loginAction = useCallback(() => {
    dispatch({type: 'user/setIsLogin', payload: true});
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
  console.log(!isLogin && isShowLoginRegister, '123123');
  return (
    <Modal visible={!isLogin && isShowLoginRegister} animationType={'slide'}>
      <View style={style.loginRegister}>
        <Text>login-register</Text>
        <PatIcon name="sms" />
        <Button onPress={loginAction} title="登录" />
      </View>
    </Modal>
  );
};

export default LoginRegiter;
